<template>
	<view>
		<view class="img-a">
			<view class="t-b">
				移动护理
			</view>
		</view>
		<view class="login-view">
			<view class="t-login">
				<form class="cl">
					<view class="t-a">
						<text class="txt">账号</text>
						<input v-model="loginForm.username" class="input" type="text" placeholder="请输入账号"
							maxlength="30" />
					</view>
					<view class="t-a">
						<text class="txt">密码</text>
						<input v-model="loginForm.password" type="password" class="input" placeholder="请输入密码"
							maxlength="20" />
					</view>
					<button @click="handleLogin">登 录</button>
				</form>
			</view>
		</view>
	</view>
</template>

<script>
	import {
		getCodeImg
	} from '@/api/login'
	import checkVersion from '@/pages/lq-upgrade/checkVersion.js'
	import {
		cheakFile
	} from '@/api/system/cheakload.js'
	import config from '@/config'
	export default {
		data() {
			return {
				codeUrl: "",
				captchaEnabled: true,
				// 用户注册开关
				register: false,
				globalConfig: getApp().globalData.config,
				loginForm: {
					username: uni.getStorageSync('loginFormVar').username,
					password: uni.getStorageSync('loginFormVar').password,
					code: "",
					uuid: ''
				}
			}
		},
		created() {
			this.getCode()
		},
		methods: {
			// 用户注册
			handleUserRegister() {
				this.$tab.redirectTo(`/pages/register`)
			},
			// 隐私协议
			handlePrivacy() {
				let site = this.globalConfig.appInfo.agreements[0]
				this.$tab.navigateTo(`/pages/common/webview/index?title=${site.title}&url=${site.url}`)
			},
			// 用户协议
			handleUserAgrement() {
				let site = this.globalConfig.appInfo.agreements[1]
				this.$tab.navigateTo(`/pages/common/webview/index?title=${site.title}&url=${site.url}`)
			},
			// 获取图形验证码
			getCode() {
				getCodeImg().then(res => {
					this.captchaEnabled = res.captchaEnabled === undefined ? true : res.captchaEnabled
					if (this.captchaEnabled) {
						this.codeUrl = 'data:image/gif;base64,' + res.img
						this.loginForm.uuid = res.uuid
					}
				})
			},
			// 登录方法
			async handleLogin() {
				if (this.loginForm.username === "") {
					this.$modal.msgError("请输入您的账号")
				} else if (this.loginForm.password === "") {
					this.$modal.msgError("请输入您的密码")
				} else {
					this.$modal.loading("登录中，请耐心等待...")
					this.pwdLogin()
				}
			},
			// 密码登录
			async pwdLogin() {
				this.$store.dispatch('Login', this.loginForm).then(() => {
					this.$modal.closeLoading()
					this.loginSuccess()
					this.upgrade()
				}).catch(() => {
					if (this.captchaEnabled) {
						this.getCode()
					}
				})
			},
			// 登录成功后，处理函数
			loginSuccess(result) {
				// 设置用户信息
				this.$store.dispatch('GetInfo').then(res => {
					// console.log(this.$store.state.user.permissions)
				})
				try {
					uni.setStorageSync('loginFormVar', this.loginForm);
				} catch (e) {
					this.$modal.msgError("写入缓存密码错误" + e)
				}
			},
			upgrade() {
				var a = {}
				cheakFile().then(res => {
					// 获取系统信息
					var version = uni.getStorageSync('version');
					var versionCode = uni.getStorageSync('versionCode');
					if (res.length > 0) {
						if (versionCode < res[0].versionName * 1) {
							let name = res[0].versionNumber; //新版本名称
							let code = res[0].versionName * 1; //新版本号（数字）
							let content = res[0].content; //更新内容
							let url = config.baseUrl + "/system/file/download?fileName=" + res[0]
								.fileUrl; //app下载链接，（演示请换成真正在下载链接）
							let forceUpdate = true; //是否强制更新
							a = {
								name, //最新版本名称
								code, //最新版本号
								content, //更新内容
								url, //下载链接
								forceUpdate //是否强制升级			  
							}
							checkVersion(a)
						} else {
							this.$tab.reLaunch('/pages/work/index')
						}
					} else {
						this.$tab.reLaunch('/pages/work/index')
					}
				}).catch(error => {
					reject(error)
				})
			},
		}
	}
</script>

<style>
	page {
		background-color: #ffffff;
	}

	.txt {
		font-size: 40rpx;
		color: #333333;
	}

	.img-a {
		width: 100%;
		height: 450rpx;
		background-image: url(/static/head.png);
		background-size: 100%;
	}

	.reg {
		font-size: 28rpx;
		color: #fff;
		height: 90rpx;
		line-height: 90rpx;
		border-radius: 50rpx;
		font-weight: bold;
		background: #f5f6fa;
		color: #000000;
		text-align: center;
		margin-top: 30rpx;
	}

	.login-view {
		/* 	width: 100%; */
		position: relative;
		margin-top: -120rpx;
		background-color: #ffffff;
		border-radius: 8% 8% 0% 0;
	}

	.t-login {
		width: 600rpx;
		margin: 0 auto;
		font-size: 40rpx;
		padding-top: 80rpx;
	}

	.t-login button {
		margin-top: 100rpx;
		font-size: 50rpx;
		background: #46a3ff;
		color: #fff;
		height: 90rpx;
		line-height: 90rpx;
		border-radius: 50rpx;
	}

	.t-login input {
		height: 90rpx;
		line-height: 90rpx;
		margin-bottom: 50rpx;
		border-bottom: 1px solid #e9e9e9;
		font-size: 40rpx;
	}

	.t-login .t-a {
		position: relative;
	}

	.t-b {
		text-align: center;
		font-size: 60rpx;
		color: #ffffff;
		padding: 130rpx 0 0 0;
		font-weight: bold;
		line-height: 70rpx;
	}

	.t-login .t-c {
		position: absolute;
		right: 22rpx;
		top: 22rpx;
		background: #5677fc;
		color: #fff;
		font-size: 24rpx;
		border-radius: 50rpx;
		height: 50rpx;
		line-height: 50rpx;
		padding: 0 25rpx;
	}

	.t-login .t-d {
		text-align: center;
		color: #999;
		margin: 80rpx 0;
	}

	.t-login .t-e {
		text-align: center;
		width: 250rpx;
		margin: 80rpx auto 0;
	}

	.t-login .t-g {
		float: left;
		width: 50%;
	}

	.t-login .t-e image {
		width: 50rpx;
		height: 50rpx;
	}

	.t-login .t-f {
		text-align: center;
		margin: 150rpx 0 0 0;
		color: #666;
	}

	.t-login .t-f text {
		margin-left: 20rpx;
		color: #aaaaaa;
		font-size: 27rpx;
	}

	.t-login .uni-input-placeholder {
		color: #aeaeae;
	}

	.cl {
		zoom: 1;
	}

	.cl:after {
		clear: both;
		display: block;
		visibility: hidden;
		height: 0;
		content: '\20';
	}
</style>